<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
    <%@page isELIgnored="false" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
	<meta charset="utf-8">
	<title>薪酬报表</title>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link id="bootstrap-style" href="<c:url value="/css/bootstrap.min.css"/>" rel="stylesheet">
	<link href="<c:url value="/css/bootstrap-responsive.min.css"/>" rel="stylesheet">
	<link id="base-style" href="<c:url value="/css/style.css"/>" rel="stylesheet">
	<link id="base-style-responsive" href="<c:url value="/css/style-responsive.css"/>" rel="stylesheet">
	<link href="<c:url value="/css/index.css"/>" rel="stylesheet">
	<link rel="shortcut icon" href="<c:url value="/img/favicon.ico"/>">
	<link href="<c:url value="/css/page.css"/>" rel="stylesheet">
	<link rel="stylesheet" type="text/css" href="<c:url value="/css/jquery.datetimepicker.css"/>"/>
	<link href="<c:url value="/css/but.css"/>" rel="stylesheet"/>"
	<script src="<c:url value="/js/jquery-1.9.1.min.js"/>"></script>
	<script src="<c:url value="/js/jquery-migrate-1.0.0.min.js"/>"></script>
	<script type="text/javascript" src="<c:url value="/js/layer/layer.js"/>"></script>
	<script src="<c:url value="/js/laydate/laydate.js"/>"></script>
	<script src="<c:url value="/js/build/jquery.datetimepicker.full.js"/>"></script>
</head>
 <script type="text/javascript">
 
 
 function gotoPage(pageNum){
	 	var totalPage=jQuery("#totalPage").val();
		regexpdat=/^\d+$/;
		if(!regexpdat.test(pageNum)){
			alert("查询的页面必须为数字");
			return ;
		}
		if(1 > pageNum || pageNum > totalPage){
			alert("请求页面不在范围之内，请重新输入");
			return;
		}
		jQuery("#currentPage").val(pageNum);
		document.forms["frm"].submit();
	}
 
 function submitForm(){
	 var tusname=jQuery("#tusname").val();
	 tusname= encodeURI(encodeURI(tusname));
	 jQuery("#name").val(tusname);
	 var time=jQuery("#time").val().trim();
	 if(time==null||time==""){
		alert("查询日期不能为空！");
		return;
	 }
	 var url=$("#basePath").attr("value")
	 url+="remuneration/index";
	 $("#frm").attr('action',url);
	 document.forms["frm"].submit();
 }
 
 function insertForm(){
	 var time=jQuery("#time").val().trim();
	 if(time==null||time==""){
		alert("查询日期不能为空！");
		return;
	 }
	 var url=$("#basePath").attr("value")
	 url+="remuneration/insert";
	 $("#frm").attr('action',url);
	 document.forms["frm"].submit();
 }
function getUserPayReport(id) {
     layer.open({
	   title: '薪酬详情',
       type: 2,
       area: ['600px', '650px'],
       fixed: false, //不固定
       maxmin: true,
       content: '<%=basePath%>remuneration/getUserPayReport?id='+id
     });
 }
function exportForm(){
	 var time=jQuery("#time").val().trim();
	 if(time==null||time==""){
		alert("查询日期不能为空！");
		return;
	 }
	 var url=$("#basePath").attr("value");
	 url+="remuneration/export";
	 $("#frm").attr('action',url);
	 document.forms["frm"].submit();
}
 </script>
<body>
<div class="container-fluid-full" style="margin-top: -20px">
	<div class="row-fluid">
		<div id="basePath" value="<%=basePath%>" style="display:none;"></div>
		<form name="frm" id="frm" method="get" action="<%=basePath%>remuneration/index">
				<input type="hidden" id="totalPage" name="totalPage" value="${totalPage}"> 
				<input type="hidden" id="currentPage" name="currentPage" value="${currentPage}"> 
				<input type="hidden" id="name" name="name" value="${name}"> 
				<div id="content" class="span10" >
					<div class="row-fluid content-search">
						<div>
							<span>工号</span>
							<input type="text" id="jobnumber" name="jobnumber" value="${jobnumber }">
						</div>
						<div>
							<span>姓名</span>
							<input type="text" id="tusname" name="tusname" value="${name }">
						</div>
						<div>
							<span>日期</span>
							<input type="text" id="time" name="time" value="${time }">
						</div>
						<div><button class="but" type="button" id="select" onclick="submitForm();">查询</button></div>
						<div><button class="but" type="button" id="select" onclick="insertForm();">生成报表</button></div>
						<div><button id="output" class="but" type="button" onclick="exportForm();">导出</a></button></div>
					</div>
					<div class="row-fluid content-table">
						<table class="table table-striped table-bordered bootstrap-datatable">
						  <thead>
							  <tr>
							  	  <th>工号</th>
								  <th>姓名</th>
								  <th>薪资总额</th>
								  <th>实际薪资</th>
								  <th>实际底薪</th>
								  <th>加班薪资</th>
								  <th>出勤天数</th>
								  <th>缺勤天数</th>
								  <th>迟到扣款</th>
								  <th>早退扣款</th>
								  <th>公积金</th>
								  <th>社保</th>
								  <th>应税薪资</th>
								  <th>个税</th>
								  <th>福利</th>
								  <th>补贴</th>
								  <th>实发薪资</th>
								  <th>操作</th>
							  </tr>
						  </thead>   
						  <tbody>
						  	<c:forEach items="${list }" var="a">
								<tr>
									<td>${a.user.jobnumber }</td>
									<td>${a.user.name }</td>
									<td>${a.totalpayroll }</td>
									<td>${a.realsalary }</td>
									<td>${a.actualbasesalary }</td>
									<td>${a.overtimemoney }</td>
									<td>${a.ycqts }</td>
									<td>${a.absenteeismdays }</td>
									<td>${a.latedeductions }</td>
									<td>${a.earlydeductions }</td>
									<td>${a.accumulationFund }</td>
									<td>${a.socialSecurity }</td>
									<td>${a.taxableSalary }</td>
									<td>${a.personalIncomeTax }</td>
									<td>${a.subsidy }</td>
									<td>${a.otherSubsidies }</td>
									<td>${a.payroll }</td>
									<td>
										<a href="#" onclick="getUserPayReport(${a.id});">详情</a>
									</td>
								</tr>
						  	</c:forEach>
						  </tbody>
					  </table>            
					</div>	
					<div id="app">
				    <div>
				    
				      <div class="page"  v-show="show">
				      	<div class="span">
						</div>
				        <div class="pagelist">
				        
				          <span class="jump" :class="{disabled:pstart}" onClick="gotoPage(1);">首页</span>
				          <span class="jump" :class="{disabled:pstart}" onClick="gotoPage(${currentPage}-1);return false;">上一页</span>
				          <span v-show="current_page>5" class="jump" onClick="gotoPage(1);">1</span>
				          <span class="ellipsis"  v-show="efont">...</span>
				          <span class="jump" v-for="num in indexs" :class="{bgprimary:current_page==num}" onClick="gotoPage(jQuery(this).text());">{{num}}</span>
				          <span class="ellipsis"  v-show="ebehind">...</span>
				
				          <span :class="{disabled:pend}" class="jump" onClick="gotoPage(${currentPage}+1);return false;">下一页</span>
				          <span v-show="current_page<pages-4" class="jump" onClick="gotoPage(${totalPage})">{{pages}}</span>
				
				          <span class="jumppoint">跳转到：</span>
				          <span class="jumpinp"><input type="text" v-model="changePage" name="pageNum" id="pageNum" value=""/></span>
				          <span class="jump gobtn" onClick="gotoPage(jQuery('#pageNum').val())">GO</span>
				        </div>
				      </div>
				    </div>
				  </div>
				</div>
		</form>
	</div>
</div>
			<script src="<c:url value="/js/vue.js"/>"></script>
			<script src="<c:url value="/js/vueClick.js"/>"></script>
			<script type="text/javascript">
 
	//年月选择器
laydate.render({
	  elem: '#time'
	  ,type: 'month'
	});
 
 

 </script>
</body>
</html>
